import {
  ModalForm,
  ProFormSwitch,
  ProFormText,
  ProFormTextArea,
} from "@ant-design/pro-components";
import { Form, message } from "antd";
import JSON5 from "json5";
import React from "react";
import { saveMaterial } from "../../../../api";

const SaveMaterial = ({ reload, children, payload }: any) => {
  const [form] = Form.useForm();
  return (
    <ModalForm
     
      // width={400}
      trigger={React.cloneElement(children)}
      form={form}
      onOpenChange={(open) => {
        if (open && payload) {
          // payload.schema = JSON5.stringify(payload.schema, null, 4);
          form.setFieldsValue(payload);
        }
      }}
      onFinish={async (e) => {
        console.log("JSON5", JSON5);
        // e.schema = JSON5.parse(e.schema, (key, value) => {
        //   return key === "_id" ? uniqueId() : value;
        // });
        await saveMaterial(e);
        message.success("保存成功");
        reload();
        return true;
      }}
    >
      <ProFormText hidden name="id"  />
      <ProFormText name="name" label="物料名称" />
      <ProFormText name="component" label="物料标识" />
      <ProFormSwitch name="isContainer" label="容器组件" />

      {/* <ProFormText name="url" label="物料组件地址" /> */}
      {/* <ProFormTextArea name="schema" label="物料协议" /> */}
      <ProFormTextArea name="description" label="物料描述" />

    </ModalForm>
  );
};
export default SaveMaterial;
